<template>
  <view class="index">
    <!-- <u-swiper :list="list" @click="noFunction"></u-swiper> -->
    <u-gap height="15"></u-gap>
    <view class="grid-box">
      <u-grid :border="false">
        <!-- <u-grid-item @click="noFunction">
          <u-icon name="plus-circle-fill" color="#00BFA3" :size="48"></u-icon>
          <text class="grid-text">商户在线登记</text>
        </u-grid-item> -->
        <u-grid-item @click="gotoCheck">
          <view v-if="noread" class="dot">{{ noread }}</view>
          <u-icon name="file-text-fill" color="#5D90F0" :size="48"></u-icon>
          <text class="grid-text">商户账单查询</text>
        </u-grid-item>
        <!-- <u-grid-item @click="noFunction">
          <u-icon name="grid-fill" color="#6968fc" :size="48"></u-icon>
          <text class="grid-text">商户免费应用</text>
        </u-grid-item> -->
      </u-grid>
    </view>
    <!-- <div class="text-title">活动中心</div>
    <u-swiper :list="list1" @click="noFunction"></u-swiper> -->
  </view>
</template>

<script lang="ts" setup>
import { noFunction } from "@/utils/commonToast";
import { ref } from 'vue';

const noread = ref(0)

const list = ref([
  'https://cdn.uviewui.com/uview/swiper/swiper2.png',
  'https://cdn.uviewui.com/uview/swiper/swiper3.png'
])

const list1 = ref(['https://cdn.uviewui.com/uview/swiper/swiper1.png'])

const gotoRegistration = () => {
  uni.navigateTo({ url: '/pages/registration/registration' })
}

const gotoCheck = () => {
  uni.navigateTo({ url: '/pages/check/check' })
}
</script>

<style lang="scss" scoped>
.index {
  padding: $uni-spacing-row-lg
}

.grid-text {
  margin-top: 10px;
  font-size: 14px;
}

.dot {
  padding: 2px 5px;
  border-radius: 50%;
  background-color: $uni-color-error;
  color: white;
  font-size: 10px;
  position: absolute;
  top: 0;
  right: 20px;
}

.grid-box {
  padding: 20px 0;
  background-color: white;
  border-radius: 10px;
}
</style>